<template>
  <div>
    <h2>组件传值</h2>
    <!-- 使用组件 -->
    <!-- 如果给子组件传递数据，则通过自定义属性的方式传递 -->
    <GoodsList
    v-for="item in list" :key="item.id"
    :id="item.id"
    :pname="item.pname"
    :price="item.price"
    :info="item.info"
    @kanyidao="pianyi"
    ></GoodsList>
   

  </div>
</template>

<script>
//导入组件
import GoodsList from "@/components/GoodsList.vue";

export default {
  data() {
    return {
      username: "lisi",
      age: 20,
      list: [
        { id: 101, pname: '超级无敌棒棒糖', price: 15, info: '好吃，再来一根' },
        { id: 171, pname: '超级解渴水果茶', price: 80, info: '好甜，真好喝' },
        { id: 191, pname: '超级好吃大鸡腿', price: 60, info: '可口，下饭~' }
      ]
    };
  },
  //注册组件
  components: {
    GoodsList,
  },
  methods:{
    pianyi(id){
      const row = this.list.find(item=>{
        // return '条件'
        return item.id === id
      })
      row.price--
    }
  }
};
</script>

<style>
</style>